<?php
/**
 * @version $Id: form.php 44 2011-09-27 04:55:47Z lnmtrung $
 */
 defined('_JEXEC') or die('Restricted access'); 
 ?>
<!-- Strart Progressbar-->
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/cupertino/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> 
<!--  End progressbar--> 
 
<link href="<?php echo JURI::base(true)?>/components/com_wrd/assets/css/uploadify.css" type="text/css" rel="stylesheet" />
<!--<script type="text/javascript" src="<?php //echo JURI::base(true)?>/components/com_wrd/assets/js/jquery-1.4.2.min.js"></script>-->
<script type="text/javascript" src="<?php echo JURI::base(true)?>/components/com_wrd/assets/js/swfobject.js"></script>
<script type="text/javascript" src="<?php echo JURI::base(true)?>/components/com_wrd/assets/js/jquery.uploadify.v2.1.4.min.js"></script>
<style>
	.progress{
		font-size:15px;
	}
	.uploadifyQueueItem {
	    background-color: #F5F5F5;
	    border: 2px solid #E5E5E5;
	    font: 11px Verdana,Geneva,sans-serif;
	    margin-top: 5px;
	    padding: 10px;
	    width: 300px;
	}
	
	#backgroundfile{
		width:160px;
		text-align: center;
	}

	#imagefile{
		text-align:left;
	}

	.image_prview {
	    background-color: #F5F5F5;
	    border: 2px solid #E5E5E5;
	    float: left;
	    margin: 2px;
	    padding: 5px;
	    text-align: center;
	    width: 160px;
	}
</style>

<script type="text/javascript">
jQuery(document).ready(function() {
	jQuery( "#progressbar" ).progressbar({value: false});
	jQuery.ajax({
		url: "index.php?option=com_wrd&task=import",
		type: "POST",
		data: 'id=0&filename='+'<?php echo urlencode($this->data[0]->name) ?>',
		success: function (res) {
            //console.log();
			obj = jQuery.parseJSON(res);
			doajax(obj.current,'<?php echo urlencode($this->data[0]->name) ?>');
		}		
	});
	
	function doajax(id,name){
		jQuery.ajax({
			url: "index.php?option=com_wrd&task=import",
			type: "POST",
			data: 'id='+id+'&filename='+name,
			success: function (res) { 
			
				obj = jQuery.parseJSON(res);
				if(obj.total == "0"){
					jQuery('#next2').hide();
					var html='<h1>Data has been insertions</h1>';
					jQuery('#step3').show();
					jQuery('#step3').html(html);
				}
				if (obj.current < obj.total){
					doajax(obj.current, name) ; 
				} else { 		
					jQuery('#next2').show();
					jQuery('#step3').show();
				}
				
				//html = html + '<div style="percent" >'+Math.round((obj.current/obj.total)*100,2)+'%</div></div>';
				var val = Math.round((obj.current/obj.total)*100,2);
				 jQuery( "#progressbar" ).progressbar({
					value: val,
					change: function(){
						jQuery("#progress-label").text( val + "%" );
					},
					//jQuery("#progress-label").text( val + "%" ),
					complete: function() {
						jQuery("#progress-label").text( "Complete!" );
					}
				
				});
				
			}		
		});
	}
});
</script>
<style>
.progress-label {
	float: left;
	margin-left: 40%;
	margin-top: 5px;
	font-weight: bold;
	text-shadow: 1px 1px 0 #fff;
}
</style>
<?php //echo 1;die; ?>
<form id="adminForm"  action="<?php echo JRoute::_("index.php?option=com_wrd&controller=transaction")?>" method="post" name="adminForm">
	<div class="col width-100">
	    <fieldset class="adminform">
	    	<legend><?php echo JText::_('Import Transaction')?></legend>
			<table class="table table-striped adminlist">
				<tr>
					<td id="step1">
						<div id="imagefile">
							<?php if(!empty($this->data)):?>
								<?php foreach ($this->data as $file): ?>
									<?php if($file->type == 'transaction'): ?>
										<div id="image_<?php echo $file->id; ?>" class="image_prview">
											<div><img src="<?php echo JURI::base(true) ?>/components/com_wrd/assets/images/csv.png" /></div>
										</div>
									<?php endif;?>
								<?php endforeach; ?>
							<?php endif;?>
						</div>	
					</td>
					
					<td id="next1" width="10%">
						<a href="javascript:void(null)">
							<div style="float:left; text-align: center; font-size:20px;">
								<div style="padding-left: 24px;"><img src="components/com_wrd/assets/images/next.png"></div>
								<div>Import Transaction</div>
							</div>
						</a>
					</td>
					<td id="step2" width="30%" valign="top" style="padding-top: 44px;">
						<!--<img src="<?php //echo JURI::root();?>images/loading.gif" style="margin-top: 0;" /> <span>Loading...</span>-->
						<div id="progressbar"><div id="progress-label" class="progress-label">Loading...</div></div>
					</td>
					
					<td id="next2" style="display: none;">
            			<a href="index.php?option=com_wrd&controller=transaction&layout=formconvert&id=<?php echo JRequest::getInt('id'); ?>">
            				<div style="width: 315px;float:left; text-align: center; font-size:20px;margin-top: -20px;">
            					<div><img style="margin-top: -17px;" src="components/com_wrd/assets/images/next.png"></div>
								<div style="float: right;padding-top: 4px;width: 233px;">Convert Transaction</div>
							</div>	
						</a>
            		</td>
            		<td id="step3" width="30%" style="display: none">	
						
					</td>
				</tr>
            </table>
		</fieldset>
	</div>
	<input type="hidden" name="controller" value="transaction" />
	<input type="hidden" name="option" value="com_wrd" />
	<input type="hidden" name="task" value="" />
	<?php echo JHTML::_( 'form.token' ); ?>
</form>